<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <%@include file="../_static/_head.jsp"%>
</head>
<body>
<div class="layui-card">
    <nav class="breadcrumb"><a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>
    <div class="layui-card-header">测试上传</div>
    <div class="layui-upload">
        <button type="button" class="layui-btn" id="uploadImg">上传图片</button>
        <div class="layui-upload-list">
            <img class="layui-upload-img" id="showImg">
            <p id="uploadImgMsg"></p>
        </div>
    </div>
</div>
<script src="<%=basePath%>plugins/layui/layui.js"></script>
<script src="<%=basePath%>plugins/dateformat.js"></script>
<script>
    layui.use('upload', function(){
        var $ = layui.jquery
            ,upload = layui.upload;

        //普通图片上传
        var uploadInst = upload.render({
            elem: '#uploadImg'
            ,url: '/testing/upload.json'
            ,accept: 'file'
            ,size: 1024
            ,before: function(obj){
                obj.preview(function(index, file, result){
                    $('#showImg').attr('src', result);
                });
            }
            ,done: function(res){
                //如果上传失败
                if(res.code ==500){
                    return layer.msg(res.msg);
                }else{
                    alert(res.msg);
                }
                //上传成功
            }
            ,error: function(){
                var demoText = $('#uploadImgMsg');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs upload-reload">重试</a>');
                demoText.find('.upload-reload').on('click', function(){
                    uploadInst.upload();
                });
            }
        });
    });
</script>
</body>
</html>
